<template>
	<view class="container">
		<van-sticky>
			<Search />
		</van-sticky>
		<u-notice-bar :text="text" v-if="text"></u-notice-bar>
		<Carousel :notice="text" />
		<view class="book">
			<view class="book_item" @click="goToDoante">
				<image src="/static/icons/donate.png"></image>
				<view class="text">
					<text>我想捐赠</text>
				</view>
			</view>
			<view class="book_item" @click="goToNeed">
				<image src="/static/icons/need.png"></image>
				<view class="text">
					<text>我有需求</text>
				</view>
			</view>
		</view>
		<IndexInfo ref="indexInfo"></IndexInfo>
	</view>
</template>

<script>
	import Carousel from '@/components/Index/Carousel.vue'
	import Search from '@/components/Index/Search.vue'
	import IndexInfo from '@/components/Index/IndexInfo.vue'
	export default {
		name: "Index",
		components: {
			Search,
			Carousel,
			IndexInfo,
		},
		data() {
			return {
				text: ''
			}
		},
		onShow() {
			this.getNotice()
			this.$refs.indexInfo.getDonateList()
			this.$refs.indexInfo.getNeedList()
		},
		onLoad() {},
		onReachBottom() {
			var activeIndex = this.$refs.indexInfo.activeClass;
			if (activeIndex == 0) { //加载捐赠信息
				this.$refs.indexInfo.donatePage++ //每次触底查询页码加一
				this.$refs.indexInfo.isBottomRefresh1 = true //标识是捐赠列表触底操作
				setTimeout(() => {
					if (this.$refs.indexInfo.status1 == 'noMore') return // 没有更多数据之后 就不会在触底加载
					this.$refs.indexInfo.getDonateList()
				}, 500)
			} else { //加载需求信息
				this.$refs.indexInfo.needPage++ //每次触底查询页码加一
				this.$refs.indexInfo.isBottomRefresh2 = true //标识是需求列表触底操作
				setTimeout(() => {
					if (this.$refs.indexInfo.status2 == 'noMore') return // 没有更多数据之后 就不会在触底加载
					this.$refs.indexInfo.getNeedList()
				}, 500);
			}

		},
		methods: {
			// 判断是否已登录
			async checkLogin() {
				if (uni.getStorageSync("token")) {
					// 获取用户信息
					const {
						data: res
					} = await this.$myRequest({
						url: '/loginBefore/getMemberInfo',
						header: {
							'content-type': 'application/json;charset:utf-8',
							'token': uni.getStorageSync("token"),
						}
					})
					console.log(res);
					if (res.code == 20000) {
						// 将用户id放进缓存
						uni.setStorageSync('userId', res.data.userInfo.userId)
					} else if (res.code == 20001) {
						uni.showToast({
							title: '登录已过期,请重新登录!',
							icon: 'none'
						})
						uni.clearStorageSync()
						setTimeout(() => {
							uni.navigateTo({
								url: '/pages/Mine/Login'
							})
						}, 2000)

					}
				} else {
					uni.showToast({
						title: '请先登录!',
						icon: 'error'
					});
					setTimeout(() => {
						uni.navigateTo({
							url: '/pages/Mine/Login'
						})
					}, 1000)
				}
			},
			// 跳转到捐赠页面
			goToDoante() {
				if (!uni.getStorageSync('userId')) {
					this.checkLogin()
				} else {
					uni.navigateTo({
						url: '/pages/Publish?index=0',
					});
				}
			},
			// 跳转到需求页面
			goToNeed() {
				if (!uni.getStorageSync('userId')) {
					this.checkLogin()
				} else {
					uni.navigateTo({
						url: '/pages/Publish?index=1',
					});
				}
			},
			// 获取公告内容
			async getNotice() {
				const {
					data: res
				} = await this.$myRequest({
					url: '/noticeBefore/getNotice',
				})
				this.text = res.data.notice.comment
			}
		}
	}
</script>
<style lang="scss" scoped>
	.container {
		position: relative;
		overflow: hidden;
	}

	/deep/.u-notice-bar {
		margin-top: 108rpx;
	}

	.book {
		display: flex;
		justify-content: space-around;

		.book_item {
			display: flex;
			float: left;
			width: 340rpx;
			height: 140rpx;
			margin-top: 20rpx;
			align-items: center;
			background-color: white;
			border-radius: 20rpx;

			image {
				margin: auto 20rpx;
				width: 100rpx;
				height: 100rpx;
			}

			.text {
				text:first-child {
					font-size: 34rpx;
					font-weight: bold;
				}
			}
		}
	}
</style>
